<template>
  <div>
    <div class="operation-bar">
      <el-button type="primary" size="small" @click="handleAdd">新增合作关系</el-button>
      <el-button type="primary" size="small" @click="refreshList">刷新</el-button>
    </div>

    <el-table v-loading="loading" :data="cooperationList" style="width: 100%; margin-top: 10px;">
      <el-table-column prop="cooperationId" label="ID"align="center"/>
      <el-table-column prop="contractNo" label="合同编号"align="center"/>
      <el-table-column prop="cooperationType" label="合作类型"align="center">
        <template #default="scope">
          <el-tag
              :type="getCooperationTypeTag(scope.row.cooperationType)"
          >{{ scope.row.cooperationType }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column label="合作日期"align="center">
        <template #default="scope">
          {{ scope.row.startDate }} 至 {{ scope.row.endDate }}
        </template>
      </el-table-column>
      <el-table-column prop="cooperationStatus" label="状态"align="center">
        <template #default="scope">
          <el-tag
              :type="getStatusTag(scope.row.cooperationStatus)"
          >{{ getStatusText(scope.row.cooperationStatus) }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="priorityLevel" label="优先级"align="center">
        <template #default="scope">
          <el-tag
              :type="getPriorityLevelTag(scope.row.priorityLevel)"
          >{{ scope.row.priorityLevel }}
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="paymentTerms" label="付款条件"align="center"/>
      <el-table-column prop="creditLimit" label="信用额度"align="center">
        <template #default="scope">
          {{ scope.row.creditLimit ? '¥' + scope.row.creditLimit : '-' }}
        </template>
      </el-table-column>
      <el-table-column label="创建时间" align="center" prop="createTime">
        <template #default="scope">
          {{ parseTime(scope.row.createTime) }}
        </template>
      </el-table-column>
      <el-table-column label="操作"align="center">
        <template #default="scope">
          <el-button type="text" size="small" @click="handleEdit(scope.row)">编辑</el-button>
          <el-button type="text" size="small" @click="handleDetail(scope.row)">详情</el-button>
          <el-button type="text" size="small" class="delete-btn" @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 合作关系表单对话框 -->
    <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="50%" :before-close="handleClose">
      <cooperation-form
          ref="cooperationForm"
          :supplier-id="supplierId"
          :cooperation="currentCooperation"
      />
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="submitForm" v-if="!isViewMode">确 定</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import {
  getCooperationsBySupplierId,
  getCooperation,
  addCooperation,
  updateCooperation,
  deleteCooperation
} from '@/api/supplierCooperation';
import CooperationForm from './CooperationForm.vue';

export default {
  name: 'CooperationList',
  components: {
    CooperationForm
  },
  props: {
    supplierId: {
      type: Number,
      required: true
    }
  },
  data() {
    return {
      loading: false,
      cooperationList: [],
      dialogVisible: false,
      dialogTitle: '',
      currentCooperation: {},
      isViewMode: false
    };
  },
  created() {
    this.getList();
  },
  methods: {
    // 获取合作关系列表
    getList() {
      if (!this.supplierId) return;

      this.loading = true;
      getCooperationsBySupplierId(this.supplierId).then(res => {
        if (res.code === 200) {
          this.cooperationList = res.data || [];
        } else {
          this.$message.error('获取合作关系记录失败');
        }
        this.loading = false;
      }).catch(() => {
        this.loading = false;
      });
    },

    // 刷新列表
    refreshList() {
      this.getList();
    },

    // 新增合作关系
    handleAdd() {
      this.dialogTitle = '新增合作关系';
      this.currentCooperation = {};
      this.isViewMode = false;
      this.dialogVisible = true;
      if (this.$refs.cooperationForm) {
        this.$refs.cooperationForm.resetForm();
      }
    },

    // 编辑合作关系
    handleEdit(row) {
      this.dialogTitle = '编辑合作关系';
      this.isViewMode = false;

      getCooperation(row.cooperationId).then(res => {
        if (res.code === 200) {
          this.currentCooperation = res.data;
          this.dialogVisible = true;
        } else {
          this.$message.error('获取合作关系详情失败');
        }
      });
    },

    // 查看合作关系详情
    handleDetail(row) {
      this.dialogTitle = '合作关系详情';
      this.isViewMode = true;

      getCooperation(row.cooperationId).then(res => {
        if (res.code === 200) {
          this.currentCooperation = res.data;
          this.dialogVisible = true;
        } else {
          this.$message.error('获取合作关系详情失败');
        }
      });
    },

    // 删除合作关系
    handleDelete(row) {
      this.$confirm('确认删除该合作关系记录?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteCooperation(row.cooperationId).then(res => {
          if (res.code === 200) {
            this.$message.success('删除成功');
            this.getList();
          } else {
            this.$message.error(res.message || '删除失败');
          }
        });
      }).catch(() => {
      });
    },

    // 提交表单
    submitForm() {
      this.$refs.cooperationForm.validate().then(formData => {
        if (formData.cooperationId) {
          // 更新
          updateCooperation(formData).then(res => {
            if (res.code === 200) {
              this.$message.success('更新成功');
              this.dialogVisible = false;
              this.getList();
            } else {
              this.$message.error(res.message || '更新失败');
            }
          });
        } else {
          // 新增
          addCooperation(formData).then(res => {
            if (res.code === 200) {
              this.$message.success('添加成功');
              this.dialogVisible = false;
              this.getList();
            } else {
              this.$message.error(res.message || '添加失败');
            }
          });
        }
      }).catch(err => {
        console.error('表单验证失败', err);
      });
    },

    // 关闭对话框
    handleClose() {
      this.dialogVisible = false;
    },

    // 获取合作类型标签样式
    getCooperationTypeTag(type) {
      switch (type) {
        case '长期':
          return 'success';
        case '短期':
          return 'warning';
        case '项目':
          return 'info';
        default:
          return '';
      }
    },

    // 获取状态标签样式
    getStatusTag(status) {
      switch (status) {
        case 1:
          return 'success';
        case 2:
          return 'warning';
        case 0:
          return 'danger';
        default:
          return 'info';
      }
    },

    // 获取状态文本
    getStatusText(status) {
      switch (status) {
        case 1:
          return '正常';
        case 2:
          return '暂停';
        case 0:
          return '终止';
        default:
          return '未知';
      }
    },

    // 获取优先级标签样式
    getPriorityLevelTag(level) {
      switch (level) {
        case '高':
          return 'danger';
        case '中':
          return 'warning';
        case '低':
          return 'info';
        default:
          return '';
      }
    }
  }
}
</script>

<style scoped>
.operation-bar {
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-start;
}

.delete-btn {
  color: #F56C6C;
}
</style>
